<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>登录页面</title>
  <style>
    body {
      background-image: url("background.jpg");
      background-repeat: no-repeat;
      background-size: 100% 100%;
      background-attachment: fixed;      /*图片铺满整个页面*/
    }
    .main {
      width: 500px;
      height: 300px;
      box-shadow: 0 5px 20px 0 #e8e8e8;
      background-color: white;
      border-radius: 10px;
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      margin: auto;
    }
    .main h2 {
      color: lightseagreen;
      margin-left: 150px;
    }
    .form {
      margin-top: 30px;
      margin-left: 60px;
    }
    .form input {
      width: 300px;
      height: 25px;
      border: 1px solid lightgray;
      outline: none;      /*输入内容时不显示边框*/
    }
    .form button {
      width: 150px;
      height: 30px;
      color: white;
      background-color: lightseagreen;
      border-style: none;
      border-radius: 5px;
      font-size: 15px;
      margin-top: 15px;
      margin-left: 130px;
      outline: none;
      cursor: pointer;    /*光标放到上面有小手*/
    }
  </style>
</head>
<body>
<div class="main" id="app">
  <h2>欢迎访问管理系统</h2>
  <form action="" method="post" class="form">
    <p>用户名: <input type="text", name="username"><br></p>    <!--输入的用户名保存到username变量，传回后端-->
    <p>密&nbsp;&nbsp;&nbsp;码: <input type="password", name="password"><br></p>
    <p><input type="radio" name="Gender" value="男">男</p>
    <p><input type="radio" name="Gender" value="女">女</p>
    <p>地&nbsp;&nbsp;&nbsp;址:<input type="text" name="addr"></p>
    <button type="submit">注册</button><br>
  </form>
</div>

</script>
</body>
</html>
